{#
/**
 * @file
 * Theme override to display all the fields in a row.
 *
 * Available variables:
 * - view: The view in use.
 * - fields: A list of fields, each one contains:
 *   - content: The output of the field.
 *   - raw: The raw data for the field, if it exists. This is NOT output safe.
 *   - class: The safe class ID to use.
 *   - handler: The Views field handler controlling this field.
 *   - inline: Whether or not the field should be inline.
 *   - wrapper_element: An HTML element for a wrapper.
 *   - wrapper_attributes: List of attributes for wrapper element.
 *   - separator: An optional separator that may appear before a field.
 *   - label: The field's label text.
 *   - label_element: An HTML element for a label wrapper.
 *   - label_attributes: List of attributes for label wrapper.
 *   - label_suffix: Colon after the label.
 *   - element_type: An HTML element for the field content.
 *   - element_attributes: List of attributes for HTML element for field content.
 *   - has_label_colon: A boolean indicating whether to display a colon after
 *     the label.
 *   - element_type: An HTML element for the field content.
 *   - element_attributes: List of attributes for HTML element for field content.
 * - row: The raw result from the query, with all data it fetched.
 *
 * @see template_preprocess_views_view_fields()
 */
#}

<div class="p-2 flex flex-col sm:flex-row items-center rounded-sm bg-white dark:bg-gray-800 overflow-hidden">
  <div class="w-full flex flex-col p-4 flex-1">
    {# 标题 - 添加适当的层级和样式 #}
    <h2 class="mb-2 text-gray-900 dark:text-white dark:hover:text-sky-400 transition-colors">
      {{ fields.title.content }}
    </h2>

    {# 内容摘要 - 确保正确处理空内容 #}
    {% if fields.body is not empty and fields.body.content %}
      <p class="font-light leading-6 my-2 line-clamp-3 text-gray-700 dark:text-gray-300">
        {{ fields.body.content|striptags|trim }}
      </p>
    {% endif %}

    {# 标签 - 处理无标签的情况 #}
    {% if fields.field_tags is not empty and fields.field_tags.content %}
      <div class="flex flex-wrap gap-2 mt-4 text-sm text-gray-500 dark:text-gray-400">
        <span class="font-medium">标签：</span>
        {{ fields.field_tags.content }}
      </div>
    {% endif %}
  </div>
</div>
